<!-- 首页 介绍组件 -->
<template>
  <div class="homeSlogan">

    <div class="emptyBox"></div>

    <TitleSub :tagName="'h3'" :til="[$t('home.BlockWatchIntroduce')]"></TitleSub>

    <div class="halfEmptyBox"></div>

    <HomeThreeCard></HomeThreeCard>

  </div>
</template>

<script setup>
import TitleSub from "@/components/pages/common/TitleSub.vue";
import HomeThreeCard from "@/components/pages/home/HomeThreeCard.vue";

</script>

<style lang="less" scoped>
.homeSlogan {
  width: 10.24rem;
  margin: 0 auto;

  .emptyBox {
    height: 1rem;
  }

  .halfEmptyBox {
    height: 0.5rem;
  }

  .banner {
    width: 10.24rem;
  }

}

/* h5 适配样式：当视口宽度小于 600px 时 */
@media (max-width: 600px) {

  .homeSlogan {
    width: 100%;

    .emptyBox {
      height: 0.4rem;
    }

    .halfEmptyBox {
      height: 0.2rem;
    }

    .banner {
      width: 100%;
    }

  }

}
</style>